<template>
  <div v-loading.pre="isLoading" class="unknown-page">
    <ImageLoader placeholder="http://localhost:4000/static/image/fix-bar.jpg"
      src="http://localhost:4000/static/image/bar.jpg" :duration="1200"></ImageLoader>
      <!-- <div class="card">
        <Card size="small" src="http://localhost:4000/static/image/g36c.png"></Card>
      </div> -->
  </div>
</template>

<script>
import fetchData from '../../mixins/fetchData';
import { getBanners } from '../../api/banner';
// import Card from '@/components/Card'
import ImageLoader from '@/components/ImageLoader'
export default {
  components: {
    // Card,
    ImageLoader
  },
  mixins: [fetchData([])],
  data() {
    return {
    }
  },
  methods: {
    async fetchData() {
      return await getBanners()
    }
  }
}
</script>

<style lang="less" scoped>
.unknown-page {
  width: 100%;
  height: 100%;
  /* margin-top: 40px; */

  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;

  // .card {
  //   position: absolute;
  // }
}
</style>